<%@ page language="java" contentType="text/html; charset=utf-8" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page import="com.rdk.utils.SystemConfig" %>
<%@taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta charset="utf-8"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <title>写分享</title>
    <script type="text/javascript">
		var basePath = '${basePath}';
	</script>	
    <meta id="viewport" name="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0"/>
    <meta name="format-detection" content="telephone=no"/>
    <link href="<c:url value='/resource/css/main.css' />" type="text/css" rel="stylesheet">
    <link href="<c:url value='/resource/css/iconfont.css' />" type="text/css" rel="stylesheet">
</head>

<body>
<div class="container">
    <header class="module-topbar">
        <a class="fl" href="javascript:history.go(-1);"><spring:message code="cancel"/></a>
        <span><spring:message code="writeShare"/></span>
        <a class="fr" href="javascript:"><spring:message code="send"/></a>
    </header>
    <article class="module-publisher margin-topbar" title="<spring:message code="writeShare"/>">
        <div class="txt-publisher-wrapper">
            <textarea id="txt-publisher" name="content" class="J-textarea txt-publisher"
                      maxlength="140" placeholder="<spring:message code="shareNews"/>..."></textarea>
            <!-- <div class="max-length"></div> -->
			<div class="max-length"><div class="maxlength"></div></div>

            <div class="J-preview hid" title="预览">
            </div>
            <div class="statusBar hid" title="状态">
                <div class="progress">
                    <span class="text">0%</span>
                    <span class="percentage"></span>
                </div>
                <div class="info"></div>
            </div>
        </div>
        <div class="info-publisher">
            <a class="scope fr" href="javascript:;">
                <i class="iconfont public">&#xe61a;</i>
                <i class="iconfont private hid">&#xe61b;</i>
                <i class="iconfont enable hid">&#xe61c;</i>
                <i class="iconfont disable hid">&#xe61d;</i>
                <span><spring:message code="public"/></span></a>
            <a class="pos" href="javascript:;"><i class="iconfont">&#xe60b;</i> <span><spring:message code="location"/></span></a>
        </div>
        <section class="action-publisher layout-box line-bottom" title="操作栏">
            <div class="box-col" style="position:relative;" title="图片">
                <i class="iconfont">&#xe60c;</i>

                <div name="filePicker"></div>
            </div>
            <div class="box-col" style="position:relative;display: none;" title="视频">
                <i class="iconfont">&#xe60d;</i>
                <input id="videoToUpload" class="picupload" name="fileselect[]" type="file" accept="video/*" onchange="onFileChange()" />
            </div>
            <div class="box-col" title="@好友">
                <i class="iconfont friend">&#xe60f;</i>
            </div>
            <div class="box-col" title="表情">
                <i class="iconfont emotion">&#xe60e;</i>
            </div>
        </section>
        <img id="myImage" src="" alt=""/>
        <jsp:include page="emotion.jsp" >
			<jsp:param name="open_from" value="wirte" />
		</jsp:include>
    </article>
</div>


<script type="text/javascript" src="${basePath}/resource/js/common/messages_${sessionScope.lang}.js"></script>
<script type="text/javascript" src="${basePath}/resource/js/share/jquery.min.js"></script>
<script type="text/javascript" src="${basePath}/resource/js/share/laytpl.js"></script>
<script type="text/javascript" src="${basePath}/resource/js/share/layer/layer.m.js"></script>
<script type="text/javascript" src="${basePath}/resource/js/share/swipeSlide.js"></script>
<script type="text/javascript" src="${basePath}/resource/js/share/jquery.maxlength.js"></script>
<script type="text/javascript" src="${basePath}/resource/js/share/webuploader.html5only.js"></script>
<script type="text/javascript" src="${basePath}/resource/js/share/json2.js"></script>
<script type="text/javascript" src="${basePath}/resource/js/share/ajaxfileupload.js"></script>
<script type="text/javascript" src="${basePath}/resource/js/share/share.js?20160128"></script>
<script type="text/javascript" src="${basePath}/resource/js/share/cordova/main.js"></script>
<script>
    Page.serverPath = '<%=SystemConfig.readValue("server.path")%>';

    $(function () {

        Share.create($('.module-publisher')).write();

        $("#txt-publisher").maxlength({
            counterContainer: $(".txt-publisher-wrapper .max-length"),
            text: '%left'
        });

    });
    
    function onFileChange() {
    	if($('.video').length > 0){
    		return;
    	}
        var fileName = $('.picupload').val();
        var len = fileName.length;
        var name = fileName.substring(len - 4, len).toLowerCase();
        if (name != ".mp4" && name != ".mov") {
            Page.notice(messages.selectFormat);
            return;
        }
        var file = document.getElementById('videoToUpload').files[0];
        if (file) {
            if (file.size > 1024 * 1024 * 10) {
                Page.notice(messages.videoIsTooLarge);
                return;
            }
        }
        var userToken = localStorage.getItem("userTonken");
        var lang = localStorage.getItem("lang");
        var url = "<c:url value='/share/ajaxFileUpload.do?userToken="+userToken+"&lang="+lang+"' />";
        $.ajaxFileUpload({
            url : url,
            secureuri : false,
            fileElement : $('#videoToUpload'),
            dataType : 'json',//返回数据的类型
            data : {},//一同上传的数据
            success : function(data, status) {
                var index = data.indexOf("{");
                var end=data.indexOf("}")+1;
                if (index > 0) {
                    data = data.substring(index, end);
                }
                
                data = JSON.parse(data);
                if (data.resultCode == '1') {
//                    Page.notice(data.data);
                    var li = $('<div class="uploadList" style="width: auto;">'
                                    + '<video class="video" poster="" width="240" controls="" preload="">'
                                    + '<source src="' + data.data + '" media="only screen and (min-device-width: 240px)">'
                                    + '</video><span class="pic-dele"></span>'
                                    + '<i class="pic-dele iconfont" onclick="deleteVideo()">&#xe61f;</i></div>');
                    $('.J-preview').append(li).show().find('.add-picture').hide();
                    $('[name="filePicker"]').hide();
                }
            },
            error : function(data, status, e) {
            }
        });
    }

    function deleteVideo() {
        $('.J-preview').hide().find('.add-picture').show().siblings('.uploadList').remove();
        $('[name="filePicker"]').show();
    }
</script>

<jsp:include page="scope.jsp"/>
<jsp:include page="friends.jsp"/>
</body>

</html>
